<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html"
      xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html">
    <head>
        <title>LOOKWIDER.COM</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <link rel="stylesheet" type="text/css" href="reset.css" />
        <link rel="stylesheet" type="text/css" href="metrostyle/css/modern.css"/>
        <link rel="stylesheet" type="text/css" href="metrostyle/css/modern-responsive.css"/>
        <link rel="stylesheet" href="chosen/chosen.css">

        <script type="text/javascript" src="js/jquery.js"></script>
        <script type="text/javascript" src="chosen/chosen.js"></script>
        <script type="text/javascript" src="metrostyle/javascript/dropdown.js"></script>
        <script type="text/javascript" src="metrostyle/javascript/accordion.js"></script>
        <script type="text/javascript" src="metrostyle/javascript/buttonset.js"></script>
        <script type="text/javascript" src="metrostyle/javascript/carousel.js"></script>
        <script type="text/javascript" src="metrostyle/javascript/input-control.js"></script>
        <script type="text/javascript" src="metrostyle/javascript/pagecontrol.js"></script>
        <script type="text/javascript" src="metrostyle/javascript/rating.js"></script>
        <script type="text/javascript" src="metrostyle/javascript/slider.js"></script>
        <script type="text/javascript" src="metrostyle/javascript/tile-slider.js"></script>
        <script type="text/javascript" src="metrostyle/javascript/tile-drag.js"></script>
        <script type="text/javascript" src="edeploy/tiledeploy.js"></script>
        <script>$(".chzn-select").chosen();</script>



    </head>
    <body class="modern-ui" onload="prettyPrint()" style="zoom: 1;">

    <div class="topbar">
        <div class="nav-bar bg-color-lighten">

        <div class="nav-bar-inner padding10">
           <span class="pull-menu"></span>
            <a href="index.html">
                <span class="element brand"><img src="FrameElements/SecondTopBar/LOOKWIDERCOM.png"/></span>
            </a>
            <div class="divider"></div>
            <ul class="menu">

                <li>
                    <a href="settings.html" style="color: black;">Моя Страница</a>
                </li>
                <li>
                    <a href="messages.html" style="color: black;">Сообщения</a>
                </li>
                <li>
                    <a href="#" style="color: black;">Выйти</a>
                </li>
                <li style="color: black; margin-left: 350px;">
                    <!-- TODO insert chosen plugin (selectbox already has class)-->
                    <select data-placeholder="Житомир" style="width:350px;color: black;" class="chzn-select" tabindex="2">
                        <option value=""></option>
                        <optgroup label="Украина">
                            <option>Житомир</option>
                            <option>Киев</option>
                            <option>Днепропетровс</option>
                            <option>Харьков</option>
                        </optgroup>
                                <optgroup label="Россия">
                                    <option>Москва</option>
                                    <option>Санкт-Петербург</option>
                                    <option>Воронеж</option>
                                    <option>Новосибирск</option>
                                </optgroup>
                                </select>

                </li>
                <li><a/></li>
                <li class="divider"></li>
                <li><a /></li>
            </ul>

        </div>
            </div>

    </div>

<div class="clearfix"></div>
    <div class="sidebar">
        <div class="span3 bg-color-blue" style="line-height: 36px;"><a href="#"> &nbsp + Заведение</a>

        </div>
        <div class="span3 bg-color-green" style="line-height: 36px;"><a href="#"> &nbsp + Резидент</a>

        </div>
        <div class="span3 bg-color-purple" style="line-height: 36px;"><a href="#"> &nbsp + Квест</a>

        </div>


    </div>
    <div class="contentframe">

        <div class="topbar bg-color-blueLight " style="padding-top:5px;" data-param-period="15000">


        <div class="input-control text span4" style="float: left; margin-left: 100px;">
            <input type="text" class="with-helper" />
            <button class="helper"></button>
        </div>
        <input type="submit" value="Искать"/>
            <div class="clearfix"></div>
        </div>

        <div class="pagecont">

        <div class="carousel" data-role="carousel">
            <div class="slides">
                <div class="slide bg-color-darken" id="slide1" >
                    <!-- Assigned id's to SPANS to identify JS what requires to be resized-->
                    <div class="span8 bg-color-blue" id="eat" style="height: 150px; margin-left: 50px;">
                        <h2><a href="proflisteat.html" style="font-size: 1em;">&nbsp Поесть, Посидеть</a></h2>
                      <div class="arrowbtnopen" style="float: right; margin-top: 70px;"><a href="#"><i class="icon-arrow-down-right fg-color-white">

                      </i></a></div>
                    </div>

                    <div class="span6 bg-color-green" id="shop" style="height: 150px; margin-left: 450px;">
                        <h2><a href="" style="font-size: 1em;"> &nbsp Покупки</a></h2>
                        <div class="arrowbtnopen"><a href="#"><i class="icon-arrow-down-right fg-color-white" style="vertical-align: bottom;"></i></a></div>
                    </div>
                    <div class="description">
                        Выберите фильтр для навигации
                    </div>
                </div>

                <div class="slide mixed bg-color-darken" id="slide2">
                    <div class="span6 bg-color-grayDark" style="margin-left: 450px; height: 150px;" id="auto">
                        <h2><a href="" style="font-size: 1em;">&nbsp Авто</a></h2>
                         <div class="arrowbtnopen"><a href="#"><i class="icon-arrow-down-right fg-color-white" style="vertical-align: bottom;"></i></a></div>
                    </div>
                    <div class="clearfix"></div>
                    <div class="span8 bg-color-purple" style="margin-left: 50px; height: 150px;" id="rest">
                        <h2><a href="" style="font-size: 1em;"> &nbsp Отдых</a></h2>

                        <div class="arrowbtnopen"><a href="#"><i class="icon-arrow-down-right fg-color-white" style="vertical-align: bottom;"></i></a></div>
                    </div>
                    <div class="description">
                        Выберите фильтр для навигации
                    </div>
                </div>

                <div class="slide bg-color-darken" id="slide3" >
                    <div class="span8 bg-color-red" style="margin-left: 50px;" id="medicine">
                        <h2><a href="" style="font-size: 1em;"> &nbsp Медицина</a></h2>

                        <div class="arrowbtnopen"><a href="#"><i class="icon-arrow-down-right fg-color-white" style="vertical-align: bottom;"></i></a></div>
                    </div>
                    <div class="clearfix"></div>

                    <div class="description">
                        Выберите фильтр для навигации
                    </div>
                </div>

            </div>

            <span class="control left">‹</span>
            <span class="control right">›</span>

        </div>
            <div class="clearfix"></div>
        <div class="newsframe">
        <div class="resnews">
            <ul class="replies">
                <li class="bg-color-blue" style="width: 100%">
                    <div class="avatar"><img/></div>
                    <div class="reply">
                        <div class="date">13.03.2013</div>
                        <div class="author"><a href="Resident.html">Ололошкин Брандарбаман</a></div>
                        <div class="rating"data-role="rating" data-param-vote="off" data-param-rating="5"></div>
                        <div class="karma">112235813</div>
                        <div class="text">Признан лучшим Шеф-Поваром г. Киева</div>
                        <div class="establishment"><a href="Placecommon-relayout.html">Ресторан "Марио"</a></div>
                    </div>
                </li>
            </ul>
        </div>

         <div class="resnews">
            <ul class="replies">
                <li class="bg-color-blue" style="width: 100%">
                    <div class="avatar"><img/></div>
                    <div class="reply">
                        <div class="date">13.03.2013</div>
                        <div class="author"><a href="Resident.html">Ололошкин Брандарбаман</a></div>
                        <div class="rating"data-role="rating" data-param-vote="off" data-param-rating="4.7"></div>
                        <div class="karma">112235813</div>
                        <div class="text">Признан лучшим Официантом г. Киева</div>
                        <div class="establishment"><a href="Placecommon-relayout.html">Кабак "Кузька"</a></div>
                    </div>
                </li>
            </ul>
            </div>

           <div class="clearfix"></div>

        <div class="resnews">
            <ul class="replies">
                <li class="bg-color-blue" style="width: 100%">
                    <div class="avatar"><img/></div>
                    <div class="reply">
                        <div class="date">13.03.2013</div>
                        <div class="author"><a href="Resident.html">Ололошкин Брандарбаман</a></div>
                        <div class="rating"data-role="rating" data-param-vote="off" data-param-rating="4.6"></div>
                        <div class="karma">112235813</div>
                        <div class="text">Признан лучшим Барменом г. Киева</div>
                        <div class="establishment"><a href="Placecommon-relayout.html">Ночной-клуб "Сталин"</a></div>
                    </div>
                </li>
            </ul>
        </div>

        <div class="resnews">
            <ul class="replies">
                <li class="bg-color-green" style="width: 100%">
                    <div class="avatar"><img/></div>
                    <div class="reply">
                        <div class="date">13.03.2013</div>
                        <div class="author"><a href="Resident.html">Ололошкин Брандарбаман</a></div>
                        <div class="rating"data-role="rating" data-param-vote="off" data-param-rating="5"></div>
                        <div class="karma">112235813</div>
                        <div class="text">Признан лучшим Мерчендайзером г. Киева</div>
                        <div class="establishment"><a href="Placecommon-relayout.html">Супермаркет "Фурор"</a></div>
                    </div>
                </li>
            </ul>
        </div>
        <div class="clearfix"></div>

            <div class="resnews">
                <ul class="replies">
                    <li class="bg-color-green" style="width: 100%">
                        <div class="avatar"><img/></div>
                        <div class="reply">
                            <div class="date">13.03.2013</div>
                            <div class="author"><a href="Resident.html">Ололошкин Брандарбаман</a></div>
                            <div class="rating"data-role="rating" data-param-vote="off" data-param-rating="4.7"></div>
                            <div class="karma">112235813</div>
                            <div class="text">Признан лучшим Менеджером-Администратором г. Киева</div>
                            <div class="establishment"><a href="Placecommon-relayout.html">Магазин: "Раза"</a></div>
                        </div>
                    </li>
                </ul>
            </div>

            <div class="resnews">
                <ul class="replies">
                    <li class="bg-color-green" style="width: 100%">
                        <div class="avatar"><img/></div>
                        <div class="reply">
                            <div class="date">13.03.2013</div>
                            <div class="author"><a href="Resident.html">Ололошкин Брандарбаман</a></div>
                            <div class="rating"data-role="rating" data-param-vote="off" data-param-rating="4.4"></div>
                            <div class="karma">112235813</div>
                            <div class="text">Признан лучшим Продавцом г. Киева</div>
                            <div class="establishment"><a href="Placecommon-relayout.html">Магазин "Топ-топ-оп"</a></div>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="clearfix"></div>
                 </div>

        <div class="hiddennews">

            <div class="resnews">
                <ul class="replies">
                    <li class="bg-color-blue" style="width: 100%">
                        <div class="avatar"><img/></div>
                        <div class="reply">
                            <div class="date">13.03.2013</div>
                            <div class="author"><a href="Resident.html">Ололошкин Брандарбаман</a></div>
                            <div class="rating"></div>
                            <div class="karma">112235813</div>
                            <div class="text">Признан лучшим Шеф-Поваром г. Киева</div>
                            <div class="establishment"><a href="Placecommon-relayout.html">Ресторан "Марио"</a></div>
                        </div>
                    </li>
                </ul>
            </div>

            <div class="resnews">
                <ul class="replies">
                    <li class="bg-color-blue" style="width: 100%">
                        <div class="avatar"><img/></div>
                        <div class="reply">
                            <div class="date">13.03.2013</div>
                            <div class="author"><a href="Resident.html">Ололошкин Брандарбаман</a></div>
                            <div class="rating"></div>
                            <div class="karma">112235813</div>
                            <div class="text">Признан лучшим Официантом г. Киева</div>
                            <div class="establishment"><a href="Placecommon-relayout.html">Кабак "Кузька"</a></div>
                        </div>
                    </li>
                </ul>
            </div>

            <div class="clearfix"></div>

            <div class="resnews">
                <ul class="replies">
                    <li class="bg-color-blue" style="width: 100%">
                        <div class="avatar"><img/></div>
                        <div class="reply">
                            <div class="date">13.03.2013</div>
                            <div class="author"><a href="Resident.html">Ололошкин Брандарбаман</a></div>
                            <div class="rating"></div>
                            <div class="karma">112235813</div>
                            <div class="text">Признан лучшим Барменом г. Киева</div>
                            <div class="establishment"><a href="Placecommon-relayout.html">Ночной-клуб "Сталин"</a></div>
                        </div>
                    </li>
                </ul>
            </div>

            <div class="resnews">
                <ul class="replies">
                    <li class="bg-color-green" style="width: 100%">
                        <div class="avatar"><img/></div>
                        <div class="reply">
                            <div class="date">13.03.2013</div>
                            <div class="author"><a href="Resident.html">Ололошкин Брандарбаман</a></div>
                            <div class="rating"></div>
                            <div class="karma">112235813</div>
                            <div class="text">Признан лучшим Мерчендайзером г. Киева</div>
                            <div class="establishment"><a href="Placecommon-relayout.html">Супермаркет "Фурор"</a></div>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="clearfix"></div>

            <div class="resnews">
                <ul class="replies">
                    <li class="bg-color-green" style="width: 100%">
                        <div class="avatar"><img/></div>
                        <div class="reply">
                            <div class="date">13.03.2013</div>
                            <div class="author"><a href="Resident.html">Ололошкин Брандарбаман</a></div>
                            <div class="rating"></div>
                            <div class="karma">112235813</div>
                            <div class="text">Признан лучшим Менеджером-Администратором г. Киева</div>
                            <div class="establishment"><a href="Placecommon-relayout.html">Магазин: "Раза"</a></div>
                        </div>
                    </li>
                </ul>
            </div>

            <div class="resnews">
                <ul class="replies">
                    <li class="bg-color-green" style="width: 100%">
                        <div class="avatar"><img/></div>
                        <div class="reply">
                            <div class="date">13.03.2013</div>
                            <div class="author"><a href="Resident.html">Ололошкин Брандарбаман</a></div>
                            <div class="rating"></div>
                            <div class="karma">112235813</div>
                            <div class="text">Признан лучшим Продавцом г. Киева</div>
                            <div class="establishment"><a href="Placecommon-relayout.html">Магазин "Топ-топ-оп"</a></div>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="clearfix"></div>

        </div>

        <div class="clearfix"></div>

            <div class="more" style="line-height: 30px;"><a href="#">
            <i class="icon-arrow-down-2 fg-color-darken"style="font-size: 20px;"></i></a>
        </div>


        </div>
        <div class="clearfix"></div>
    <!-- EXPANDING PART HERE -->

        <div class="pagecontopened">
            <div class="span13 bg-color-blue">
                <h2> Поесть Посидеть</h2>
            </div>

            <div class="page-control" data-role="page-control">
            <span class="menu-pull"></span>
            <div class="menu-pull-bar"></div>
            <ul>

                <li class="active"><a href="#profs">Профессии</a></li>
                <li><a href="#places">Категории Заведений</a></li>


            </ul>
            <div class="frames bg-color-blue" style="height: 700px;">
                <div class="frame active" id="profs">
                    <div class="arrowbtnclose" style="float: left;vertical-align: top;"><a href="#"><i class="icon-arrow-left-3 fg-color-white" style="font-size: 45px;"></i></a></div>
                    <ul class="proflist" style="height: 550px;">
                        <a href="profpage.html"><li>Официант</li></a>
                        <a href="profpage.html"><li>Бармен</li></a>
                        <a href="profpage.html"><li>Администратор</li></a>
                        <a href="profpage.html"><li>Шеф-Повар</li></a>
                        <a href="profpage.html"><li>Охранник</li></a>

                    </ul>
                    <div class="clearfix"></div>
                    <div class="arrowbtnclose" style="margin-top: 70px; float: right;"><a href="#"><i class="icon-arrow-up-left fg-color-white"></i></a> </div>
                </div>

                <div class="frame" id="places">

                    <div class="arrowbtnclose" style="float: left;"><a href="#"><i class="icon-arrow-left-3 fg-color-white" style="font-size: 45px;"></i></a></div>
                    <ul class="proflist" style="height: 550px;">
                        <li><a href="profpage.html">Рестораны</a></li>
                        <li><a href="profpage.html">Кафе</a></li>
                        <li><a href="profpage.html">Пабы</a></li>
                        <li><a href="profpage.html">Бары</a></li>
                        <li><a href="profpage.html">Пиццерии</a></li>

                    </ul>
                    <div class="clearfix"></div>
                    <div class="arrowbtnclose" style="margin-top: 70px;float: right;"><a href="#"><i class="icon-arrow-up-left fg-color-white"></i> </a> </div>

                </div>

            </div>
        </div>
            <div class="clearfix"></div>



        </div>

    <!--END OF EXPANDED PART -->
        </div>

        <div class="topbar" style="text-align: right;">
            ©2012-2013 LOOKWIDER.COM
        </div>



    </body>
    <script type="text/javascript">
        $(".chzn-select").chosen();
        $(".chzn-select-deselect").chosen({allow_single_deselect:true});

    </script>
</html>
